<template>
  <div>
    <el-form
      :model="form"
      :rules="rules"
      ref="basicInfo"
      label-width="160px"
      class="ccui-form"
    >
      <el-row>
        <el-col :span="12">
          <el-form-item label="填报单位：" prop="reportInOrgName">
            <el-input v-model="form.reportInOrgName" disabled />
          </el-form-item>
        </el-col>
        <el-col :span="12">
          <el-form-item label="收款人：" prop="payee">
            <el-input v-model="form.payee" disabled />
          </el-form-item>
        </el-col>
      </el-row>

      <el-row>
        <el-col :span="12">
          <el-form-item label="付款申请单编号：" prop="paymentCode">
            <el-input v-model="form.paymentCode" disabled />
            <el-button
              plain
              type="single-number"
              @click="requestNumberDialogShow"
              >选择
            </el-button>
          </el-form-item>
        </el-col>
        <el-col :span="12">
          <el-form-item label="付款申请单名称：" prop="paymentName">
            <el-input
              type="text"
              v-model.trim="form.paymentName"
              show-word-limit
              disabled
            />
          </el-form-item>
        </el-col>
      </el-row>

      <el-row>
        <el-col :span="12">
          <el-form-item label="付款登记编号：">
            <el-input v-model="form.registerCode" disabled />
          </el-form-item>
        </el-col>
        <el-col :span="12">
          <el-form-item label="合同编号：" prop="contractCode">
            <el-input v-model="form.contractCode" disabled />
          </el-form-item>
        </el-col>
      </el-row>

      <el-row>
        <el-col :span="12">
          <el-form-item label="合同名称：">
            <el-input v-model="form.contractName" disabled />
          </el-form-item>
        </el-col>
        <el-col :span="12">
          <el-form-item label="合同含税金额：">
            <el-input
              v-model="form.initTotalContractPriceIncludeTax"
              disabled
            />
          </el-form-item>
        </el-col>
      </el-row>

      <el-row>
        <el-col :span="12">
          <el-form-item label="币种：">
            <el-input v-model="form.currencyName" show-word-limit disabled />
          </el-form-item>
        </el-col>
        <el-col :span="12">
          <el-form-item label="兑人民币汇率：">
            <el-input v-model="form.chExchangeRate" show-word-limit disabled />
          </el-form-item>
        </el-col>
      </el-row>
      <el-row>
        <el-col :span="12">
          <el-form-item label="已到票金额：">
            <el-input
              v-model="form.invoiceIncludeTax"
              show-word-limit
              disabled
            />
          </el-form-item>
        </el-col>
        <el-col :span="12">
          <el-form-item label="已结算金额：">
            <el-input v-model="form.settledPrice" disabled />
          </el-form-item>
        </el-col>
      </el-row>

      <el-row>
        <el-col :span="12">
          <el-form-item label="申请付款金额：">
            <el-input v-model="form.paymentMoney" disabled />
          </el-form-item>
        </el-col>
        <el-col :span="12">
          <!-- <el-form-item label="付款类型：" prop="paymentType">
            <el-input v-model="paymentTypeResult" />
          </el-form-item> -->
          <el-form-item label="付款类型：" prop="paymentType">
            <el-select
              v-model="form.paymentType"
              placeholder="请选择付款类型"
              @change="paymentTypeDataChange"
            >
              <el-option
                v-for="item in paymentTypeData"
                :key="item.value"
                :label="item.label"
                :value="item.value"
              >
              </el-option>
            </el-select>
          </el-form-item>
        </el-col>
      </el-row>

      <el-row>
        <el-col :span="12">
          <el-form-item label="付款方式：" prop="paymentMode">
            <el-select
              v-model="form.paymentMode"
              placeholder="请选择付款方式"
              @change="paymentModeDataChange"
            >
              <el-option
                v-for="item in paymentModeData"
                :key="item.value"
                :label="item.label"
                :value="item.value"
              >
              </el-option>
            </el-select>
          </el-form-item>
        </el-col>
        <el-col :span="12">
          <el-form-item
            label="票据月数："
            prop="billMonths"
            v-if="isShowBillMonths"
          >
            <el-select
              v-model="form.billMonths"
              placeholder="请选择票据月数"
              @change="billMonthsChange"
            >
              <el-option
                v-for="item in billMonthsData"
                :key="item"
                :label="item"
                :value="item"
              >
              </el-option>
            </el-select>
          </el-form-item>
        </el-col>
      </el-row>

      <el-row>
        <el-col :span="12">
          <el-form-item label="登记付款金额：" prop="registerPrice">
            <el-input
              v-model="form.registerPrice"
              placeholder="请输入登记付款金额"
              @input="formatNumberFixed('registerPrice')"
              show-word-limit
            />
          </el-form-item>
        </el-col>
        <el-col :span="12">
          <el-form-item label="付款日期：" prop="registerTime">
            <el-date-picker
              v-model="form.registerTime"
              type="date"
              placeholder="选择日期"
              value-format="yyyy-MM-dd"
            />
          </el-form-item>
        </el-col>
      </el-row>

      <el-row>
        <el-col :span="12">
          <el-form-item label="编制日期：">
            <el-input v-model="form.reportTime" disabled show-word-limit />
          </el-form-item>
        </el-col>
        <el-col :span="12">
          <el-form-item label="编制人：">
            <el-input v-model="form.reportUsername" disabled />
          </el-form-item>
        </el-col>
      </el-row>

      <el-row>
        <el-col :span="24">
          <el-form-item label="请款事由(摘要)：">
            <el-input
              class="remarkClass"
              resize="both"
              type="textarea"
              :rows="5"
              placeholder="请输入请款事由"
              maxlength="1000"
              show-word-limit
              v-model="form.reasons"
              disabled
            >
            </el-input>
          </el-form-item>
        </el-col>
      </el-row>

      <el-row>
        <el-col :span="24">
          <el-form-item label="备注：">
            <el-input
              class="remarkClass"
              resize="both"
              type="textarea"
              :rows="5"
              placeholder="请输入备注"
              maxlength="1000"
              show-word-limit
              v-model="form.remark"
              disabled
            >
            </el-input>
          </el-form-item>
        </el-col>
      </el-row>
    </el-form>
    <!-- 付款申请单编号弹框 -->
    <RequestNumberDialog
      ref="showContractDialog"
      @confirmTrueRequestNumber="confirmTrueRequestNumber"
      :reportOrgId="form.reportInOrgCode"
    />
  </div>
</template>

<script>
import paymentBasicInfo from "@/app/paymentManagement/mixins/paymentBasicInfo";
export default {
  name: "paymentChangeBasicInfo",
  mixins: [paymentBasicInfo],
  props: ["formData", "isDisabled"],
  data() {
    return {
      // 登记页面标识
      pageType: "registrationForm",
    };
  },
};
</script>
<style scoped lang="scss">
@import "./../../css/paymentBasicInfo.scss";
/deep/ .el-table__body-wrapper {
  max-height: 330px !important;
}
</style>
